import { customRef } from 'vue'
// customRef() 创建一个自定义的 ref，显式声明对其依赖追踪和更新触发的控制方式
// customRef() 预期接收一个工厂函数作为参数，这个工厂函数接受 track 和 trigger 两个函数作为参数，并返回一个带有 get 和 set 方法的对象。
// 一般来说，track() 应该在 get() 方法中调用，trigger() 应该在 set() 中调用。然而，何时调用完全看自己。

// 创建一个防抖 ref，即只在最近一次set 调用后的一段固定间隔后再调用
export function useDebouncedRef(value: any, delay = 200) {
  let timeout: number
  return customRef((track, trigger) => {
    return {
      get() {
        track()
        return value
      },
      set(newValue) {
        clearTimeout(timeout)
        timeout = setTimeout(() => {
          value = newValue
          trigger()
        }, delay)
      }
    }
  })
}